import 'package:flutter/material.dart';
import 'package:flutter_demo2/material-demo/responsive_demo/app_ui_panel/responsive_layout.dart';

import 'constants.dart';

class DrawerPage extends StatefulWidget {
  const DrawerPage({Key? key}) : super(key: key);

  @override
  State<DrawerPage> createState() => _DrawerPageState();
}

class ButtonsInfo {
  late String title;
  late IconData icon;

  ButtonsInfo({
    required this.title,
    required this.icon,
  });
}

int _currentIndex = 0;

List<ButtonsInfo> _buttonNames = [
  ButtonsInfo(title: 'Setting', icon: Icons.settings),
  ButtonsInfo(title: 'Notifications', icon: Icons.notifications),
  ButtonsInfo(title: 'Constants', icon: Icons.contact_phone_rounded),
  ButtonsInfo(title: 'Sales', icon: Icons.home),
  ButtonsInfo(title: 'Marketing', icon: Icons.sell),
  ButtonsInfo(title: 'Security', icon: Icons.verified_user),
  ButtonsInfo(title: 'Users', icon: Icons.supervised_user_circle_rounded),
];

class _DrawerPageState extends State<DrawerPage> {
  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: SingleChildScrollView(
        child: Padding(
          padding: EdgeInsets.all(Constants.kPadding),
          child: Column(
            children: [
              ListTile(
                title: Text(
                  'Admin Menu',
                  style: TextStyle(
                    color: Colors.white,
                  ),
                ),
                trailing: ResponsiveLayout.isComputer(context)
                    ? null
                    : IconButton(
                        onPressed: () {
                          Navigator.pop(context);
                        },
                        icon: Icon(
                          Icons.close,
                          color: Colors.white,
                        ),
                      ),
              ),
              ...List.generate(
                _buttonNames.length,
                (index) => Align(
                  alignment: Alignment.centerLeft,
                  child: Column(
                    children: [
                      Container(
                        decoration: index == _currentIndex
                            ? BoxDecoration(
                                borderRadius: BorderRadius.circular(20),
                                gradient: LinearGradient(
                                  colors: [
                                    Constants.redDark.withOpacity(0.9),
                                    Constants.orangeLight.withOpacity(0.9),
                                  ],
                                ),
                              )
                            : null,
                        child: ListTile(
                          title: Text(
                            _buttonNames[index].title,
                            style: TextStyle(
                              fontWeight: FontWeight.bold,
                              fontSize: 24,
                              color: Colors.white,
                            ),
                          ),
                          leading: Padding(
                            padding: EdgeInsets.all(Constants.kPadding),
                            child: Icon(
                              _buttonNames[index].icon,
                              color: Colors.white,
                            ),
                          ),
                          onTap: () {
                            setState(() {
                              _currentIndex = index;
                            });
                          },
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(20),
                          ),
                        ),
                      ),
                      Divider(
                        color: Colors.white,
                        thickness: 0.1,
                      )
                    ],
                  ),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}
